<template>
  <a-modal destroyOnClose :title="title" width="1060px" :visible="visible" @cancel="handleClose">
    <a-form-model ref="ruleFormModel" :model="formModel" :rules="rulesModel" :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }" :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }" style="padding-right: 60px">
      <title-name title="基本信息"></title-name>
      <a-row :gutter="24">
        <a-col :md="12" :sm="12">
          <a-form-model-item label="岗位名称" prop="name" class="requiredFormItem">
            <BaseInput v-model="formModel.name" placeholder="请输入"></BaseInput>
          </a-form-model-item>
        </a-col>
        <a-col :md="12" :sm="12">
          <a-form-model-item label="岗位编码" prop="code" class="requiredFormItem">
            <BaseInput v-model="formModel.code" :disabled="formModel.actualPost !== ''" placeholder="请输入"></BaseInput>
          </a-form-model-item>
        </a-col>
        <!-- <a-col :md="12" :sm="12">
          <a-form-model-item label="是否是领导" prop="isLeader" class="requiredFormItem">
            <a-select v-model="formModel.isLeader" placeholder="请选择">
              <a-select-option v-for="item in isLeaderList" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col> -->
        <a-col :md="12" :sm="12">
          <a-form-model-item label="岗位标签" class="requiredFormItem">
            <a-select v-model="formModel.postLabelIds" mode="multiple" placeholder="请选择">
              <a-select-option v-for="item in postList" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :md="12" :sm="12">
          <a-form-model-item label="状态" prop="enable" class="requiredFormItem">
            <a-select placeholder="请选择" v-model="formModel.enable">
              <a-select-option v-for="(item, index) in state" :value="item.value" :key="index">{{ item.name }}</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
    <template slot="footer" style="text-align: right">
      <a-button :loading="loading" type="primary" @click="handleSubmitPost">提交</a-button>
      <a-button type="primary" class="ml12" @click="handleClose">关闭</a-button>
    </template>
  </a-modal>
</template>

<script>
import ACol from 'ant-design-vue/es/grid/Col'
import ARow from 'ant-design-vue/es/grid/Row'
import TreeSelectOrganization from '@/components/TreeSelectOrganization/index' // 树
import Jobs from '@/components/TreeSelectOrganization/jobs'
import { isLeaderList, type } from './model'
import { addPostManageList, editPostManageListNew, getEditPostList, addPostByTemplateNew } from '@/api/system/system'

export default {
  name: 'addEditPost',
  components: {
    ARow,
    ACol
  },
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    postInfo: {
      type: Object,
      default() {
        return {}
      }
    },
    postIndex: {
      type: Number,
      default: 1
    },
    postList: {
      type: Array,
      default() {
        return []
      }
    }
  },
  data() {
    return {
      //状态信息
      state: [
        {
          name: '可用',
          value: 1
        },
        {
          name: '不可用',
          value: 0
        }
      ],
      rulesModel: {
        name: [{ required: true, message: '请输入', trigger: 'blur' }],
        code: [{ required: true, message: '请输入', trigger: 'blur' }],
        // isLeader: [{ required: true, message: '请选择', trigger: 'blur' }],
        postLabelIds: [{ required: true, message: '请选择', trigger: 'change' }],
        enable: [{ required: true, message: '请选择', trigger: 'change' }]
      },
      loading: false,
      // isLeaderList: isLeaderList,
      type: type,
      orgList: [{}],
      title: '',
      formModel: {
        orgId: '',
        name: '',
        code: '',
        // isLeader: undefined,
        enable: null,
        postLabelIds: [],
        actualPost: ''
      },
      treeCheckable: true,
      childrenNode: 'jobs',
      form: {
        orgSelectedName: [],
        orgSelectedLabel: [],
        selectedLabel: undefined,
        jobsSelectedName: undefined
      }
    }
  },
  mounted() {},
  watch: {
    postIndex(val, oldVal) {
      if (val === 1) {
        this.title = '岗位新增'
      } else if (val === 2) {
        this.title = '岗位编辑'
      }
    },
    postInfo(val, oldVal) {
      if (Object.keys(val).length !== 0) {
        this.formModel = val
        this.formModel.actualPost = this.formModel?.actualPost ? this.formModel.actualPost : ''
      }
    }
  },
  methods: {
    /**
     *@desc 提交表单
     *@param {}
     */
    handleSubmitPost() {
      this.$refs.ruleFormModel.validate((valid) => {
        if (valid) {
          if (this.loading) {
            return
          }
          this.loading = true
          let index = this.postIndex
          if (index === 1) {
            //用户新增
            this.handleAddPost()
          } else if (index === 2) {
            //用户编辑
            this.handleEditPost()
          }
        } else {
          return false
        }
      })
    },
    /**
     *@desc table 新增
     *@param {}
     */
    handleAddPost() {
      addPostByTemplateNew(this.formModel)
        .then((res) => {
          if (res.status === 200) {
            // 岗位新增成功
            this.loading = false
            this.$message.success('新增成功')
            this.handleClose()
          }
        })
        .catch((err) => {
          this.loading = false
          // 岗位新增失败
          console.log(err)
        })
    },
    /**
     *@desc table 编辑
     *@param {}
     */
    handleEditPost() {
      editPostManageListNew(this.formModel)
        .then((res) => {
          if (!res.data.msg) {
            // 岗位编辑成功
            this.loading = false
            this.$message.success('编辑成功')
            this.handleClose()
          } else {
            this.$message.error(res.data.msg)
          }
        })
        .catch((err) => {
          // 岗位编辑失败
          this.loading = false
          console.log(err)
        })
    },
    /**
     *@desc 重置表单
     *@param {}
     */
    handleReset() {
      this.$refs.ruleFormModel.resetFields()
    },
    /**
     *@desc 关闭用户新增
     *@desc 返回用户管理
     *@param {}
     */
    handleClose() {
      this.handleReset()
      this.$emit('handleCancel')
    }
  }
}
</script>

<style scoped>
</style>